<script>
	import {
		ref,
		reactive
	} from 'vue';
	import {
		apiUrl
	} from '@/config/config.js';

	export default {
		data() {
			return {
				patients: [],
				isLogin: false,
				act: '',
				apiUrl: apiUrl,
			}
		},
		onLoad: function(option) {
			// console.log('测试')
			this.act = option.act
			this.onRefreshPage()
		},
		methods: {
			// 刷新页面
			onRefreshPage() {
				// 判断是否已登录
				this.checkLogin1()
				// 获取页面数据
				this.getPatients()
			},

			checkLogin1() {
				try {
					const value = uni.getStorageSync('islogin_key');
					if (value) {
						this.isLogin = value;
					}
				} catch (e) {
					// error
				}

			},
			//获取地址信息
			getPatients() {
				const url = this.apiUrl+'/api/userPatient/list'
				this.notfound = false
				console.log(url)
				if (this.isLogin == true) {
					try {
						uni.request({
							// url: 'http://localhost:8080/api/userPatient/list',
							url: url,
							data: {
								account: uni.getStorageSync('account_key')
							},
							method: 'GET',
							success: (res) => {
								if (res.data.code == '200') {
									this.patients = res.data.data
								} else {

								}
							}
						})

					} catch (e) {
						// error
					}
				}
			},
			addPatients() {
				uni.navigateTo({
					url: '/pages/mine/patient/add-patient'
				});
			},
			
			editPatients(id) {
				uni.navigateTo({
					url: `/pages/mine/patient/edit-patient?id=${id}`
				});
			},
			deletePatients(id) {
				// console.log('http://localhost:8080/api/userPatient/${id}')
				uni.showModal({
					title: '友情提示',
					content: '您确定要删除该地址吗?',
					success(res) {
						if (res.confirm) {
							try {
								uni.request({
									url: `http://localhost:8080/api/userPatient/${id}`,
									method: 'DELETE',
									success: (res) => {
										if (res.data.code == '200') {
											uni.navigateTo({
												url: '/pages/mine/patient/select-patient' // 将'/pages/currentPage/currentPage'替换为当前页面的路径
											});
										}
									}
								})
							} catch (e) {
								// error
							}
						}
					}
				})
			},
			backBuy(patient){
				if(this.act == 'select'){
					
					uni.$emit('patient',{
						patientId: patient.id,
						name: patient.name
						})
					console.log(patient.name)
					uni.navigateBack({
						delta: 1
					});
					// uni.redirectTo({
					// 	url: `../../index/buy/buy?patientId=${id}`,
					// });
				}
			}
		}
	}
</script>

<template>
	<view class="container">
		<view class="oldaddress" v-for="(item,index) in patients" :key="index" @click="backBuy(item)">
			<view class="topview">
				<view class="name">{{item.name}}</view>
				<view class="phone">{{item.phone}}</view>
			</view>
			<view class="building">
				{{item.number}}
			</view>
			<view class="editing">
				<view class="pho">
					<uni-icons type="compose" size="20" color="#ffaa00"></uni-icons>
				</view>
				<view class="word1" @click="editPatients(item.id)">
					编辑
				</view>
				<view class="pho" @click="deletePatients(item.id)">
					<uni-icons type="trash" size="20" color="#ff0000"></uni-icons>
				</view>
				<view class="word" @click="deletePatients(item.id)">
					删除
				</view>

			</view>
		</view>

		<!-- 新增 -->
		<button class="btn" @click="addPatients">添加患者</button>
	</view>
</template>



<style lang="less" scoped>
	.container {
		width: 100vw;
		height: 95vh;
		background-color: rgb(242, 242, 242);
		padding-top: 1px;
	}

	.oldaddress {
		width: 100vw;
		// height: 300rpx;
		background-color: #fff;
		padding: 5% 5% 2%;
		box-sizing: border-box;
		margin: 3% 0;

		.topview {
			width: 100vw;

			.name {
				display: inline-block;
				width: 40%;
				font-size: 20px;
				color: black;
			}

			.phone {
				display: inline-block;
				width: 50%;
				text-align: right;
				font-size: 20px;
				color: black;
			}

		}

		.building {
			margin-top: 10px;
			font-size: 14px;
			color: #797979;
			padding-bottom: 20rpx;
			border-bottom: 1px solid #ccc;
		}
	}

	.editing {
		display: flex;
		justify-content: flex-end;
		margin: 10px;

		.pho {
			width: 23px;
			height: 23px;
			vertical-align: middle;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.word1 {
			font-size: 18px;
			color: #ffaa00;
			margin-left: 5px;
			vertical-align: middle;
			margin-right: 10px;
		}

		.word {
			font-size: 18px;
			margin-left: 5px;
			color: #ff0000;
			vertical-align: middle;
		}
	}

	.btn {
		height: 80rpx;
		margin: 30rpx 20rpx;
		color: #fff;
		border-radius: 80rpx;
		font-size: 30rpx;
		background-color: #27ba9b;
	}
</style>